<%@ page contentType="text/html;charset=UTF-8" pageEncoding="UTF-8" session="false" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<!doctype HTML>
<html>
    <head>
        <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
        <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
        <title> 车友会-活动 </title>
        <meta name="keywords" content="" />
        <meta name="description" content="" />
        <meta name="author" content="lijun_gz none" />
        <link rel="stylesheet" type="text/css" href="http://js.3conline.com/wap/pcauto/2014/touch/cyh.css">
    </head>

    <body class="g-doc" style="background: #f5f5f5">
        <!--栏目计数器/文章计数器-->
        <jsp:include page="/template/wap/common/counter.jspf">
            <jsp:param name="channel" value="7388" />
        </jsp:include>
        <div class="body">
            <%@include file="../common/intf6007.html" %>
            <!-- 公共头部 -->
            <div class="g-hd">
                <a href="http://m.pcauto.com.cn" class="header-home" title="太平洋汽车网"></a>
                <div class="header-title">
                    <span class="header-title-nav">
                        <a href="${WAPROOT}/">车友会</a>&nbsp;&gt;&nbsp;<a href="${WAPROOT}/${myUrl}/"> ${fn:length(fn:escapeXml(club.name))>8?fn:substring(fn:escapeXml(club.name),0,8):fn:escapeXml(club.name)}${fn:length(fn:escapeXml(club.name))>8?"...":""}</a> > 活动
                    </span>
                </div>
            </div>
            <div class="m-hdlist" id="activityList"> <div style="display: none;" class="m-none" id="nodata"><span>  &gt;_&lt; lll</span><p>该车友会还没相关活动哦~</p></div>
            </div>
            <div class="btn-more" id="showMore"><a id="J-more" onclick="loadMore();">点击查看更多</a></div>
            <script type="text/javascript" src="http://js.3conline.com/wap/2013/common/js/zepto.min.js"></script>
            <script type="text/javascript">
	            var WAPROOT="${WAPROOT}";
	            var clubId = "${club.clubId}";
	            var pageNo = 1;
	            var pageSize=10;
	            var activityHTML = '<a href="${WAPROOT}/${myUrl}/activity/a{activityId}/"><img src="{pic}" /><div class="m-hdlist-text">'
	                +'<p class="m-hdlist-tit">{title}</p>{activityStatus}<span>时间：{startDate} 至{endDate}</span>'
	                +'<span>地点：{place}</span></div></a>';
	            var nowStatusHTML='<span class="s-hdlist"><em class="eBmz">火热报名中</em></span>';
	            var centerStatusHTML='<span class="s-hdlist"><em class="eCmz">报名已结束</em></span>';
	            var endStatusHTML='<span class="s-hdlist"><em class="eHdz">活动中</em></span>';
	            var statusHTML='<span class="s-hdlist"><em class="eBm">已报名</em></span>';
	            var endActivityHTML='<span class="s-hdlist"><em>活动已结束</em></span>';
	            function listActivity(pageNo){
	                $.getJSON("${ROOT}/activity/listActivityByClubId.do?callback=?&_t="+new Date().getTime(),{clubId:clubId,pageNo:pageNo,pageSize:pageSize,rec_enc:"utf-8",resp_enc:"utf-8",userId:${user.uid}},listActivityCallback);
	            }
	            function listActivityCallback(data){
	                if(data.data){
	                    addActivity(data.data);
	                    pageNo = data.pageNo;
	                    if(data.total==0){
	                        $("#nodata").show();
	                    }
	                    if(pageNo == data.totalCount){
	                        $("#showMore").hide();
	                    }
	                }
	            }
	            function addActivity(d){
	                if(d.length>0){
	                    var len = d.length;
	                    var html="";
	                    var format = "yyyy-MM-dd";
	                    for(var i=0;i<len;i++){
	                        var startDate = new Date(d[i].beginDate);
	                        var endDate = new Date(d[i].endDate);
	                        var activityHtml = "";
	                        var userStatus = d[i].statusCode;
	                        if(userStatus==203){
	                            activityHtml = statusHTML;
	                        }else if(userStatus==102 || userStatus==103){
                                    activityHtml = centerStatusHTML;
                                }else if(userStatus==104){
                                    activityHtml = endStatusHTML;
                                }else if(userStatus==101){
                                    activityHtml = nowStatusHTML;
                                }else if(userStatus == 105){
                                    activityHtml = endActivityHTML;
                                }
	                        
	                        html += activityHTML.replace(/{title}/ig, katString(d[i].title))
                                .replace(/{pic}/ig, d[i].pic)
                                .replace(/{place}/ig, d[i].place)
                                .replace(/{startDate}/ig, formatDate(startDate,format))
                                .replace(/{endDate}/ig, formatDate(endDate,format))
                                .replace(/{activityStatus}/ig, activityHtml)
                                .replace(/{activityId}/ig, d[i].activityId);
	                    }
	                    $("#activityList").append(html);
	                    setHeight();
	                }
	            }
	            function katString(title){
	            	if(title.length>22){
                            title =  title.substring(0,22)+"...";
	            	}
	            	return title;
	            }
	            function formatDate(date,format){
	                var paddNum = function(num){
	                    num += "";
	                    return num.replace(/^(\d)$/,"0$1");
	                }
	                //指定格式字符
	                var cfg = {
	                    yyyy : date.getFullYear() //年 : 4位
	                    ,yy : date.getFullYear().toString().substring(2)//年 : 2位
	                    ,M  : date.getMonth() + 1  //月 : 如果1位的时候不补0
	                    ,MM : paddNum(date.getMonth() + 1) //月 : 如果1位的时候补0
	                    ,d  : date.getDate()   //日 : 如果1位的时候不补0
	                    ,dd : paddNum(date.getDate())//日 : 如果1位的时候补0
	                    ,hh : date.getHours()  //时
	                    ,mm : date.getMinutes() //分
	                    ,ss : date.getSeconds() //秒
	                }
	                format || (format = "yyyy-MM-dd hh:mm:ss");
	                return format.replace(/([a-z])(\1)*/ig,function(m){return cfg[m];});
	            } 
	            $(document).ready(function(){
	                listActivity(1);
	            });
	            function loadMore(){
	                listActivity(pageNo+1);
	            }
	            
	            /*满屏功能*/
	            function setHeight(){
                        var Jfoot = document.querySelector(".g-footer");
	                var Jbody = document.querySelector(".body");
	                if (!Jfoot) return;
	                if (!Jbody) return;
	                var webHeight = document.documentElement.clientHeight,
                        JbodyHeight = Jbody.clientHeight;
	                if (JbodyHeight < webHeight) {
	                    Jbody.style.height = webHeight + "px";
	                    Jbody.style.position = "relative";
	                    Jfoot.setAttribute("style", "width:100%;position:absolute;bottom:0px;");
	                } else {
	                    Jfoot.style.position = "relative";
	                }
	            }
            </script>

            <div class="g-footer">
                <!-- 公共底部 -->
                 <%@include file="../common/intf5987.html" %>
            </div>
        </div>
    </body>
</html>